const path = require('path');
const VueLoaderPlugin = require('vue-loader/lib/plugin');
const HtmlWebpackPlugin = require('html-webpack-plugin');

console.log(path.resolve(__dirname, './dist'));
console.log(path.resolve(__dirname, './src/main.js'));

module.exports = {
  mode: 'production',
  entry: './src/main.js',
  output: {
    path: path.resolve(__dirname, './dist'),
    filename: 'bundle.js',
  },
  resolve: {
    extensions: ['.js','.ts', '.tsx', '.vue'],
  },
  devtool: 'cheap-inline-source-map',
 
  module: {
    rules: [
      {
        test: /\.vue$/,                     // 处理vue文件，会将lang="ts"的代码，转交给babel-loader
        loader: 'vue-loader',
        options: {          
          esModule: false // example of setting to false
        }
      },
      {
        test: /\.css$/i,                     // 处理vue文件，会将lang="ts"的代码，转交给babel-loader
        use: ['style-loader', 'css-loader'],
      },
      {
        test: /\.tsx?$/,
        loader: 'babel-loader',
        exclude: /node_modules/,
        options: {
          presets: [
            '@babel/preset-env',
            '@vue/babel-preset-jsx',
            [
              '@babel/preset-typescript',   // 引用Typescript插件
              {
                allExtensions: true,        // 🔴支持所有文件扩展名
              },
            ],
          ],          
            "plugins": [
              
                [
                    "@babel/plugin-proposal-decorators",
                    {
                        "legacy": true
                    }
                ],
                "@babel/plugin-proposal-class-properties",
                // ['import', {
                //   libraryName: '@qsk/knight-ui',
                //   libraryDirectory: 'es',
                //   style: true
                // }],
            ]
        },
      },
    ],
  },
  plugins: [
    // make sure to include the plugin!
    new VueLoaderPlugin(),
    new HtmlWebpackPlugin({
        template: path.join(__dirname, './index.html'),
        filename: 'mobile.html',
    }),
  ],
};